import React from 'react'
import { appAdd } from '@/http/api/user'
import { Button, message, Form, Input, Select } from 'antd'
import { getUserInfo } from '@/http/api/login'
const App = () => {
  const [form] = Form.useForm()
  const [messageApi, contextHolder] = message.useMessage()
  const onFinish = async (values) => {
    console.log(values)
    const res = await appAdd(values)
    if (res.data.type == 1) {
      messageApi.success(res.data.message)
      form.resetFields()
    }
    let userInfo = JSON.parse(localStorage.getItem('userInfo'))
    const res2 = await getUserInfo({ _id: userInfo._id })
    if (res.status === 200) {
      localStorage.setItem('userInfo', JSON.stringify(res2.data.res))
      window.location.reload()
    }
  }

  return (
    <div
      style={{
        position: 'relative'
      }}
    >
      <div
        style={{
          position: 'absolute',
          top: '100px',
          left: '50%',
          transform: 'translateX(-50%)'
        }}
      >
        <Form
          name="basic"
          labelCol={{
            span: 6
          }}
          wrapperCol={{
            span: 18
          }}
          initialValues={{
            remember: true
          }}
          onFinish={onFinish}
          autoComplete="off"
          form={form}
        >
          <Form.Item
            label="小程序名称："
            name="name"
            rules={[
              {
                required: true,
                message: '请输入'
              }
            ]}
          >
            <Input style={{ width: '340px' }} />
          </Form.Item>
          <Form.Item
            label="小程序APPID:"
            name="appid"
            rules={[
              {
                required: true,
                message: '请输入'
              }
            ]}
          >
            <Input style={{ width: '340px' }} />
          </Form.Item>
          <Form.Item
            label="小程序密钥："
            name="appidPassword"
            rules={[
              {
                required: true,
                message: '请输入'
              }
            ]}
          >
            <Input style={{ width: '340px' }} />
          </Form.Item>
          <Form.Item
            label="是否跨区域发货"
            name="status"
            rules={[
              {
                required: true,
                message: '请选择'
              }
            ]}
          >
            <Select
              style={{ width: '340px' }}
              options={[
                {
                  value: '0',
                  label: '是'
                },
                {
                  value: '1',
                  label: '否'
                }
              ]}
            />
          </Form.Item>

          <Form.Item
            wrapperCol={{
              offset: 8,
              span: 16
            }}
          >
            <Button type="primary" htmlType="submit">
              确定添加
            </Button>
          </Form.Item>
        </Form>
      </div>
      {contextHolder}
    </div>
  )
}
export default App
